<!DOCTYPE html>

<html lang="zh-CN">
<head>
	<meta charset="utf-8">
	<!--
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    -->
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
	<meta name="x5-page-mode" content="app" />
	<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
	<title>您的销售详单</title>

	<!-- Bootstrap -->
	<link href="//cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">


	<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
	<script src="//cdn.bootcss.com/jquery/1.12.1/jquery.js"></script>
	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script src="//cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

	<!-- Include angular Js -->
	<script src="//cdn.bootcss.com/angular.js/1.4.9/angular.min.js"></script>

	<script src="script/ng-infinit-scroll.js"></script>


	<script>

    	var app=angular.module('app', ['infinite-scroll']).controller('ctrl', function($scope, $http) {


			var busy=$scope.busy = false;

			var pageIndex=$scope.pageIndex=0;

    		var query = $scope.query=function (){
    			if (busy)
				return;
				busy = true;
				$http({
					url : '/user-product-record',
					method : 'GET',
					params : {
						random : Math.random(),
						pageIndex :$scope.pageIndex
					}
				}).success(function(response) {
					for ( var item in response) {
						data.push(response[item]);
					}
					busy = false;
					if (response.length>0)$scope.pageIndex++;
					//alert('返回成功!');
				}.bind(this)).error(function(data, header, config, status) {
					alert("处理失败");
				}.bind(this));
    		};

    		//alert('访问ajax成功');

    		var data=$scope.data=[

    		];


			var scrollFunction= $scope.scrollFunction=function (){

				if ($(document).scrollTop()-($(document).height()-$(window).height())>=-2){
					$scope.query();
				}

			};

			query();



		});

		app.filter('timestampToString',function(){
			return function(input){
				var newDate = new Date();
				newDate.setTime(input );
				return newDate.toLocaleString();
			}
    	})


    </script>


</head>
<body class="container" id="app"  class="scroll" ng-app="app" ng-controller="ctrl">


<div >


	<div class=" panel panel-default" >
		<div class="row" style="background-color:#FF9933;color:white">
			<div class="col-xs-6  ">
				<span style="color:white"><h5><b>营业员激励支撑系统</b></h5></span>
			</div>
			<div class="col-xs-6 pull-right text-right" >
				<span style="color:white" id="displayName"><h5><b><a style="color:white" href="user_index.html">返回首页</a></b></h5></span>
			</div>
		</div>
		<div class="row text-center" style="background-color:#FF9933;color:white">
			<h4 style="color:white"><b>我的红包</b></h4>
		</div>
	</div>
	<div infinite-scroll="scrollFunction()" infinite-scroll-disabled='busy' infinite-scroll-distance="3">
	</div>


	<div class="panel panel-default " ng-repeat="x in data">
		<div class="row panel-body">
			<div class="col-xs-5">
				<div class="pull-left" style="color:#FF9933"><h5><b>红包：+￥  {{ x.money  }} </b></h5></div>

			</div>
			<div class="col-xs-7 pull-right">
				<div style="color:#666666"><h5>产品：{{ x.productname  }} </h5></div>

				<div style="color:#666666"><h5>受理时间：{{ x.createTime|timestampToString }} </h5></div>
			</div>
		</div>


	</div>
	<div class="panel panel-default " ng-show="data.length==0">
		<div class="row panel-body">
			<div class="col-xs-12 text-center">
				<h3>您还没有红包，赶快发展新用户吧</h3>
			</div>
		</div>
	</div>

	<div class="row">
		<div class="col-xs-12"  ng-show='busy' style="text-align:center" ><span class="label label-default" style="text-align:center">正在加载,请稍后</span></div>
	</div>
</div>

<footer>
	<nav class="navbar navbar-default  navbar-fixed-bottom " role="navigation">



		<div class="navbar-header col-xs-12">
			<a href="javascript:addNew()">
				<button type="button"  class="btn btn-block btn-warning btn-lg glyphicon glyphicon-shopping-cart" >发展新用户</button>
				<script>
						function addNew(){
							window.location.href="/record_form.html";
						}
					</script>

			</a>
		</div>

	</nav>
</footer>




</body>
</html>